<template>
  <!-- 收货启动,记录卸货人 -->
		<div class="ywshouhuo_xhr">
				<van-sticky>
				  <van-nav-bar class="navBar" title="卸货人" left-arrow @click-left="$router.go(-1)"></van-nav-bar>
				</van-sticky>

			<div class="goodsFromWarp">
					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">预检单号：</div>
							</div>

							<van-field
								 class="skuInput"
								 v-model="shyjForm.bill"
								 placeholder="请填写预检单号"
							 />




							<div class="searchBtn">
								<button :disabled="isdisabled"  @click.stop="modify_sle_bill()" >
									<van-icon name="ellipsis" color="#1989fa"  />
								</button>
							</div>

					</div>
			</div>



			<div class="goodsFromWarp">

					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">卸货人1：</div>
							</div>

							<van-field class="skuInput" v-model="shyjForm.xhr1"  placeholder="请填写卸货人" @change="on_modify_xhr(1)" >
								<template #button>
									  {{shyjForm.xhrm1}}
								</template>
							</van-field>
					</div>

					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">卸货人2：</div>
							</div>

							<van-field class="skuInput" v-model="shyjForm.xhr2"  placeholder="请填写卸货人" @change="on_modify_xhr(2)" >
								<template #button>
									  {{shyjForm.xhrm2}}
								</template>
							</van-field>
					</div>

					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">卸货人3：</div>
							</div>

							<van-field class="skuInput" v-model="shyjForm.xhr3"  placeholder="请填写卸货人" @change="on_modify_xhr(3)" >
								<template #button>
									  {{shyjForm.xhrm3}}
								</template>
							</van-field>
					</div>

					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">卸货人4：</div>
							</div>

							<van-field class="skuInput" v-model="shyjForm.xhr4"  placeholder="请填写卸货人" @change="on_modify_xhr(4)" >
								<template #button>
									  {{shyjForm.xhrm4}}
								</template>
							</van-field>
					</div>



			</div>






			<div class="footerBtn">
				<van-button type="info"  @click="save_xhr()" >保存</van-button>
				<van-button type="default" @click="$router.go(-1)">返回</van-button>
			</div>








				<van-overlay :show="selectBillsVisible" @click="selectBillsVisible = false">
						<van-sticky>
							<van-nav-bar class="navBar" title="选择预检单" left-arrow @click-left="selectBillsVisible = false"></van-nav-bar>
						</van-sticky>
						<div class="wrapper" @click.stop>
								<div  v-for="(row,i) in shyjTabList" :key="i" class="danjuRow" @click="use_yujiandan(row)">
									<p><span>单号：</span>{{row.bill}}</p>
									<p><span>序号：</span>{{row.no}}</p>
									<p><span>供应商：</span>{{row.vendor}}</p>
									<p><span>店号：</span>{{row.vendor}}</p>
									<p><span>状态：</span>{{row.status}}</p>
								</div>
						</div>
				</van-overlay>



		</div>


</template>

<script>
import { vendor } from "postcss";
import { mapActions } from "vuex";
export default {
  name: 'ywshouhuo_xhr',
  data () {
    return {
			shyjForm:{
				xhr4 :'',
				xhr3:'',
				xhr2:'',
				xhr1:'',
				xhrm4 :'',
				xhrm3:'',
				xhrm2:'',
				xhrm1:'',
				bill :'',
				billtype:'',
				kwvendst:'' ,
			},
			selectBillsVisible:false,
      loading:false,
			shyjTabList:[],
    }
        //活动参与与人员统计&导出
    //-- 俱乐部 活动名 活动时间 [导出] "俱乐部名称_活动编号_活动名称_参与人员表,xlsx"
  },
  methods: {
		 ...mapActions(["showLoading", "hideLoading"]),
    //弹框选预检单
    modify_sle_bill (){
      var _self = this;
			_self.$store.commit('showLoading');

		  // 原型阶段用到的字段,及字段的demo值!!!
		  var ldemodata = [{retval:0, errmsg:'返回数据集'},]
		  this.MYPOST({ 'method':'dgate','pname':'f_wmsa_shouhuo','i':this.FNULLE([
		    'opmode','qryyjdbill', 'kqid', this.ryuser.kqid])
		    }, '查带卸货预检单',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
		    if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
		    }else{
		      var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
		      if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
		      }else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
		      }
		      _self.shyjTabList = rtn_json_obj
					console.log("得到数据")
					console.log(_self.shyjTabList)
          _self.selectBillsVisible = true;
		    }
		  });
    },

    onmodify_bill(){
      //扫码输入编辑框变化事件的处理
      if(this.shyjForm.bill > ''){
        this.use_yujiandan({'billtype':'SH','bill':this.shyjForm.bill});
      }

    },

    use_yujiandan(row){
      var _self = this;
		  //原型阶段用到的字段,及字段的demo值!!!
		  var ldemodata = [{retval:0, errmsg:'返回数据集'},]
		  this.MYPOST({ 'method':'dgate','pname':'f_wmsa_shouhuo','i':this.FNULLE([
		    'opmode','qryyjdbillone', 'billtype',row.billtype, 'bill',row.bill,'kqid', this.ryuser.kqid])
		    }, '查预检单',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
		    if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail(ret_errmess)
		    }else{
		      var rtn_json_obj = null;
		      if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
		      }else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
		      }
		      _self.shyjForm = rtn_json_obj[0];
          _self.selectBillsVisible = false;
		    }
		  });
    },

    //选择卸货人,可直接手输
    on_modify_xhr(pm_lst_sleid){
      var ls_ryid = '';  var _self = this;
      if(pm_lst_sleid == 1){ ls_ryid = _self.shyjForm.xhr1; }
      else if(pm_lst_sleid == 2){ ls_ryid = _self.shyjForm.xhr2; }
      else if(pm_lst_sleid == 3){ ls_ryid = _self.shyjForm.xhr3; }
      else if(pm_lst_sleid == 4){ ls_ryid = _self.shyjForm.xhr4; }
      if(ls_ryid > ''){}else{
        return;
      }
		  //原型阶段用到的字段,及字段的demo值!!!
		  var ldemodata = [{retval:0, errmsg:'返回数据集'},]
		  this.MYPOST({ 'method':'dgate','pname':'f_wmsa_shouhuo','i':this.FNULLE([
		    'opmode','qryyjdxhrone', 'ryid', ls_ryid])
		    }, '查预检单',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
		    if(ret_iserr){ //传入的true参数,理论上不会有此回调了
						_self.$toast.fail(ret_errmess)
		       // _self.$message.error(ret_errmess,'查询失败');
		    }else{
		      var rtn_json_obj = null;
		      if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
		      }else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
		      }
		      var lobjxhr = rtn_json_obj[0];
          if(pm_lst_sleid == 1){ _self.shyjForm.xhr1 = lobjxhr.operatorid; _self.shyjForm.xhrm1 = lobjxhr.opername;} //operatorid, opername
          else if(pm_lst_sleid == 2){ _self.shyjForm.xhr2 = lobjxhr.operatorid; _self.shyjForm.xhrm2 = lobjxhr.opername;  }
          else if(pm_lst_sleid == 3){ _self.shyjForm.xhr3 = lobjxhr.operatorid; _self.shyjForm.xhrm3 = lobjxhr.opername;   }
          else if(pm_lst_sleid == 4){ _self.shyjForm.xhr4 = lobjxhr.operatorid; _self.shyjForm.xhrm4 = lobjxhr.opername;  }
		    }
		  });
    },

    //保存(修改)卸货人信息
    save_xhr(){
      var _self = this;
     //  if(this.shyjForm.bill >''){}else{
					// _self.$toast.fail('请先指定收货单')
     //    // _self.$message.error(ret_errmess,'请先指定收货单');
     //    return;
     //  }
     //  if(this.shyjForm.xhr1 >''){}else{
					// _self.$toast.fail('请至少指定一个卸货人')
     //    // _self.$message.error(ret_errmess,'请至少指定一个卸货人');
     //    return;
     //  }
		  //原型阶段用到的字段,及字段的demo值!!!
		  var ldemodata = [{retval:0, errmsg:'返回数据集'},]
		  this.MYPOST({ 'method':'dgate','pname':'f_wmsa_shouhuo','i':this.FNULLE([
		    'opmode','saveyjdbillone', 'billtype',this.shyjForm.billtype, 'bill',this.shyjForm.bill,'kqid', this.ryuser.kqid,
        'xhr1', this.shyjForm.xhr1,'xhr2', this.shyjForm.xhr2,'xhr3', this.shyjForm.xhr3,'xhr4', this.shyjForm.xhr4])
		    }, '预检',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
		    if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail(ret_errmess)
		       _self.$message.error(ret_errmess,'查询失败');
		    }else{
		      var rtn_json_obj = null;
		      if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
		      }else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
		      }
					_self.$toast.fail('预检成功')
		    }
		  });
    },

    //放弃修改
    cancel_xhr(){
      this.$router.go(-1);
    },

  },
  components:{

  },
  computed: {
     ryuser: function(){
       return this.GWO(true).gUSER;
     }
  },
  mounted :function(){
    var _self = this; window.GWO().debug=this;
    this.shyjTabList = [];
  }
}

</script>
<style scoped lang="scss">
// 引入公共样式
@import '@/assets/css/base.scss';
@import '@/assets/css/input.scss';





</style>

